leagueoflegendsfandomcom-20200222-history
League of Legends Wiki:LoLWiki Tutorial
If you're looking for the tutorial, see Tutorial Introduction Welcome to this League of Legends Wiki tutorial made by the user Tylobic. In this tutorial, we are going to see the basics of programming on LoLWiki. The League of Legends Wiki uses the markup language HTML and . You can code in HTML, but it's actually quite complicated and the Wikia community created to make it easier for everyone to code on the website. With this tutorial, we are going to see the more than HTML language. On almost every LoLWiki pages, you have the ability to edit a page if you are registered and logged in. The default editor is set to Wikia's VisualEditor, which is useful when you don't know anything about programming, but provides poor coding environment, and can sometimes change parts of the page that weren't intended, in unpredictable ways. I highly recommend changing your editor to Source editor. To do so, go to your preferences by clicking and change your editor to Source editor. Bold and Italics To put some text in Bold, you need to add 3 apostrophes on each side of the text. * Some bolded text. gives Some bolded text. To put some text in Italics, you need to add 2 apostrophes on each side of the text. * Some italics text. gives Some italics text. To put some text in Bold and Italics at the same time, you need to add 5 apostrophes on each side of the text (3 for bold, 2 for italics) * Some bolded italics text. gives Some bolded italics text. Bullet Point lists You can list up your ideas by using an asterisk * at the beginning of a sentence. The more asterisks there are, the more the text will be indented. * First sentence * Second sentence ** Remark about the second sentence * Third sentence ** Remark about the third sentence *** Remark about the remark about the third sentence Becomes * First sentence * Second sentence ** Remark about the second sentence * Third sentence ** Remark about the third sentence *** Remark about the remark about the third sentence Introduction to templates To establish a template, you need to encompass it in double curly brackets . In the middle of the double curl brackets write the name of the template, and you are good to go. In order to add an argument to a template, you will need to use a pipe divider | to separate your arguments. Some templates require more than one argument. * uses the template equals and display the equals sign . * uses the Champion icon template (shortened to ci) and has the argument Diana, it will display an icon the of champion and her name linking to the page. Here it will appear as . to display elements correctly. If an argument is invalid, it may render an error, or not parse at all. You can view the valid template arguments if you select it in visual editor, or check its coding/documentation by going to leagueoflegends.wikia.com/wiki/Template:Whatevertemplate. You should always review the documentation before utilizing a template in case you need to make adjustments. Here are some commonly used arguments, ambiguous sections are quoted: * "Custom name" * link="true/false/path" * icononly="true/false" * variant="old#" * size="#px" * possessive=true If you want to omit a default element of a template, such as an icon or link, leave the argument without input, or write =*none*. * ** * ** You can even fit templates as arguments. * Ex: }} ** }} List of frequently used templates Icons Generally you can add an "s" to the template nickname to adjust into a possessive form, various examples are showcased. In the table below, templates with possessive apostrophe are represented with a *. Format Wiki links To link to another page on the wiki, ydou need to encompass double square brackets on each side of the link. You can also rename the link by adding a pipe divider | just after the link text and just before closing the square brackets * Ability power will create a link to the page Ability power * Offensive Stat will create a link to the page Attack Damage but will appear like this: Offensive Stat. When you want to use the plural of an article title (or add any other suffix) for your link, you can add the extra letters directly outside the double square brackets. * Monsters will create a link to the page Monster but will appear like this: Monsters. Internet links To create a link to an Internet page, you need to add only one square bracket on each side of the link. Make sure that the address is prefixed with "http://www." or "https://www." You can put a name on the link by adding a space just after the text and just before the bracket, then the name you want to display. * Google will create a link the page google.com and will appear like this: Google. Headings Headings are an effective way to organize your pages, they are simple and quick to use, and allow the reader to quickly navigate through your page. Headings are encompassed by the equal signs = at each side of the title, starting with 2, up to 5. * A main heading can be created by adding 2 equal signs to each side of the text. ** Main Heading will display a big heading. * A subheading works the same way but with 3 equal signs. ** Subheading will display a smaller heading. * A sub-subheading works the same way but with 4 equal signs. ** Sub-Subheading will display a heading as big as text. * A sub-sub-subheading works the same way but with 5 equal signs. ** Sub-Sub-Subheading will display a heading smaller than text. Table of Content When using a certain number of headings, a Table of Contents (TOC) is going to appear automatically on your page, in most cases at the beginning of your page. You can control the position of the Table of Contents by encompassing two underscores _ followed by TOC and two others underscores _: __TOC__. Where you place __TOC__ on the page will represent the position of the Table of Contents on your page. The Table of Content will, by default, appear on the left side of the screen, if you want your Table of Contents to appear on the right side of the page, type . Otherwise, if you don't need a Table of Contents 'or just find it unnecessary on your page, you can type meaning ''no Table of Contents. This command will simply remove the '''Table of Contents from your page. Tabbers Tabbers are used to display informations divided into tabs. The user can only see one tab at a time. This is very useful to create compact pages, which almost doesn't require the user to scroll down. You can even create tabbers into tabbers, but it's harder to code and it's going to be harder to use for the user, . Tabbers are not created with a template but with a HTML-like tag: content. Here the content is, first, a tabber subtitle followed with the equals sign =, then write want you want to say, and when you're done, close the current tabber with a pipe | followed with a dash - and another pipe |. After you've closed the current tabber you can repeat the operation: new tabber subtitle, content, close, until you're done with your whole tabber. To close the tabber write the following . Structure of a tabber: Theme1= This is where you add the content of the Theme1 |-|Theme2= Content of Theme2 |-|Theme3= This is the Theme3's content will give Theme1= This is where you add the content of the Theme1 |-|Theme2= Content of Theme2 |-|Theme3= This is the Theme3's content With concrete elements: Champions= * * * * * |-|Items= * * * * |-|Spells= * * * * * * will give Champions= * * * * * |-|Items= * * * * |-|Spells= * * * * * * Tabbers into tabbers To create tabbers into tabbers you will need to use - }} within the . The start of the inner tabber is: - ; and to end }}. This requires experience with tabbers, do not do it otherwise. Example of tabber into tabber: Menu A= - Salads= * Chicken salad * Grilled prawns salad - Meals without meat= * Fried cheese * Fried Camembert with cranberries - Hot desserts= * Poppy seed dumblings with butter and powdered sugar * Homemade strudel with whipped cream and chocolate sauce }} |-|Menu B= - Specialties= * Potato "pirohy" with bryndza * Beef stew with root vegetables and mashed potatoes - Main courses= * Chicken steak * Grilled salmon fillet * Fried pork - Meals for children= * Chicken schnitzel, french fries * Chicken rissoto * Poppy seed dumplings with chocolate sauce }} |-|Menu C= - Drinks= *Smoothies *Vitamin Water *Water - Sides= *Salad Bar *Fruit Bar }} Indenting You can "indent" your text by using : at the beginning of some text. One : represents one "indent", two : represents two "indents", three : represents three "indents", etc. ... :Some indented text ::Some more indented text :::Some even more indented text gives :Some indented text ::Some more indented text :::Some even more indented text Numbered lists You can do the same thing as with Bullet Point lists but with numbers, by using the hash symbol # at the beginning of a sentence. The more # there are, the more the text will be indented. #First element #Second element ##First element of the second element ##Second element of the second element #Third element ##First element of the third element ###First element of the first element of the third element ###Second element of the first element of the third element ###Third element of the first element of the third element Becomes #First element #Second element ##First element of the second element ##Second element of the second element #Third element ##First element of the third element ###First element of the first element of the third element ###Second element of the first element of the third element ###Third element of the first element of the third element General Internet Tips If you ever need to find specific information on a page, you can press Ctrl + F to type what you're looking for. The Ctrl + F tool can automatically bring you to the first occurrence of the word, and then, to navigate to the other occurrence of the word you will have to press Enter for each occurrence of the word. If you're editing text, and you need to select one or more character, you can do so by using the arrows ← ↑ ↓ → and Shift. Shift + ← will add one character from the left side of your current selection. Shift + → will add one character from the right side of your current selection. In the same philosophy, Ctrl with the arrows ← ↑ ↓ → move your current selection from one word. Ctrl + ← will move your current selection to one word to the left. Ctrl + → will move your current selection to one word to the right. You can also combine Ctrl and Shift with the arrows ← ↑ ↓ → to add one word to your current selection. Ctrl + Shift + ← will add one word at the left of your selection. Ctrl + Shift + → will add one word at the right of your selection. Selection Double-click will select the word placed under your mouse. Triple-click will select the paragraph placed under your mouse. Tab and Window While you're not in a text zone, you will be able to execute these shortcuts: * Ctrl + T will create a new tab * Ctrl + Shift + T will restore the most recently closed tab * Ctrl + N will create a new window * Ctrl + Shift + N will restore the most recently closed window (only on Firefox) * Ctrl + W will close the current tab * Ctrl + Shift + W will close the current window * Hold Ctrl + Tab allow you to navigate throw your tabs * Hold Ctrl and Shift + Tab allow you to navigate throw your tabs backwards * Ctrl + 1 to 9 move you to tab number 1 to 9 * Ctrl + Scroll-up or Ctrl + + will zoom in * Ctrl + Scroll-down or Ctrl + - will zoom out * Ctrl + 0 will restore the zoom to 100%